@charset "utf-8";
/* CSS Document */
/* css 重置 */
*{margin:0; padding:0; list-style:none; }
body{ background:#fff; font:normal 12px/22px "microsoft yahei"; width:100%; }
img{ border:0;  }
a{ text-decoration:none; color: #fff; font-size: 20px;  }
a:hover{ color:#1974A1;  }

html,body{height:100%;}
body{ overflow:hidden;}
.content{height:100%;width:100%; position:absolute;left:0;top:0;}
.content>div{height:100%; background:pink; box-sizing:border-box;}

.gps{ position:absolute;right:20px;top:50%;margin-top:-50px; width: 10px;
    height: 100px;
    border: 1px solid #fff;
    border-radius: 30px;
    text-align: center;
    padding: 5px 5px 0;
    box-sizing: content-box;
    box-shadow: 0 0 3px #fff;}

.gps li{width:10px;height:10px;background:#CCC; border-radius:50%;margin-bottom:10px; cursor:pointer;}
.gps .current{width:10px;height:10px; background: #f60; box-shadow: 0px 0px 3px white;}

/* page1的导航 */
.page1-nav{ position: absolute; left: 0; top: 0; width: 100%; height: 50px; background-color:rgba(0,0,0,1);
    z-index: 100; position: fixed;}
.page1-nav ul{ width: 800px; height: 50px; margin: 0 auto; }
.page1-nav ul li{ width: 160px; height: 50px; float: left;}
.page1-nav ul li a{ display: block; width: 80px; padding-left: 80px; color: white; line-height: 50px;
    background-color:rgba(0,0,0,1); position: relative;}
.page1-nav ul li a:hover{ background-color: white; color: #ff6600;border-bottom: 5px solid #ff6600;
    height: 45px; font-weight: bold;  }
.page1-nav ul li a::before{ content: ""; width: 32px; height: 32px; background: url("../img/headicon.png");
position: absolute; left: 20px; top:10px; transition:all 0.3s;}
.page1-nav ul li a:hover::before{ background-position: 0 -160px;}
.page1-nav ul li:nth-child(2) a::before{ background-position:0 -32px; }
.page1-nav ul li:nth-child(2) a:hover::before{ background-position: 0 -192px}

.page1-nav ul li:nth-child(3) a::before{ background-position:0 -64px; }
.page1-nav ul li:nth-child(3) a:hover::before{ background-position: 0 -224px}

.page1-nav ul li:nth-child(4) a::before{ background-position:0 -96px; }
.page1-nav ul li:nth-child(4) a:hover::before{ background-position: 0 -256px}

.page1-nav ul li:nth-child(5) a::before{ background-position:0 -129px; }
.page1-nav ul li:nth-child(5) a:hover::before{ background-position: 0 -288px}

/* page1的焦点切换 */
body,html{ width:100%; height:100%; ;   }
.fullSlide{ position:absolute; left:0; top:0; width:100%;  height:100%;  min-width:1000px; background:#000  }
.fullSlide ul{ height:100% !important; width:100% !important;  }
.fullSlide li{  height:100% !important; width:100% !important; }
.fullSlide .prev,
.fullSlide .next{ position:absolute; z-index:1; display:block; width:30px; height:50px; top:50%; margin-top:-100px; left:20px;
    /*background:url(../img/icons.png) 0 0 no-repeat;*/
    cursor:pointer;  filter:alpha(opacity=60);opacity:1;  }
.fullSlide .next{ left:auto; right:30px; background-position:-51px 0; }
.fullSlide .prev:hover,
.fullSlide .next:hover{ filter:alpha(opacity=100);opacity:1; }


/*第二个页面作品展示的内容*/
.content .page2{ background:url("../img/page2.jpg") no-repeat top center; position: relative;}
.content .page2 .page2-in{ width: 770px; height: 510px; position: absolute; left: 50%;
top: 50%; margin-left: -385px; margin-top: -255px;}
.content .page2.out .page2-in{left: 129%; opacity: 0;}

.content .page2-in ul{width: 1000px;}
.content .page2-in ul li{width: 250px; height: 250px; float: left; margin-right: 10px; margin-bottom: 10px;
position: relative; }
.content .page2-in ul li:hover span{height: 250px; line-height: 250px; color: white; font-weight: bold;
font-size: 30px;}

.content .page2-in span{ width: 250px; height: 50px; position: absolute; left: 0; bottom: 0; line-height: 50px;
text-align: center; background-color: rgba(0,0,0,0.5); -webkit-transition:all 0.5s linear;}

/*第二个页面大图作品展示*/
/*第二个页面big-ban展示*/
.big-ban{ width: 840px; height:400px ; border:1px solid #000000;margin: 0px auto;
    position: relative; overflow: hidden; padding: 35px 10px 0 10px; border-radius: 15px;
    top: 50%;
    left: 50%;
    margin-left: -420px;
    margin-top: -200px;
    z-index: 100000; background: rgba(255, 255, 255, 0.80); display: none;}
.carousel{width: 828px; height: 370px; margin: 0 auto; position: relative; overflow: hidden;}
.carousel ul.imageslist{position: absolute;top:0;left:0;list-style: none; width: 9000px;}
.carousel ul.imageslist li{float: left;}
.carousel .buttons a{display: block; width: 23px; height: 47px; background: url(../img/icons.png) no-repeat; cursor: pointer;}
.carousel .buttons .leftBtn{position: absolute; top: 50% ; left:10px; background-position: 0px -172px; margin-top: -23px;}
.carousel .buttons .rightBtn{position: absolute; top: 50% ; right:10px; background-position: -23px -219px; margin-top: -23px;}
.carousel .bg{position: absolute; bottom: 0 ; left: 0; width: 100%; height: 30px; background-color: black;
    opacity: 0.6; _filter:alpha(opacity=60);}
.carousel .num{position: absolute; bottom: 0 ; right:0; width: 200px;height: 20px; }
.carousel .num span{float: left; margin-right: 6px; width: 12px; height: 12px; background: white;
    background: url(../img/icons.png) no-repeat 0 -12px;}
.carousel .num span.cur{background-position:0 0; }
.big-ban .closed{ width: 64px; height: 34px; background: rgba(0,0,0,0.5); position: absolute;
    right: 0; top: 0; color: white; line-height: 34px; text-align: center; font-weight: bold;
    cursor: pointer; border-bottom-left-radius: 15px;}

/*第二个页面big-app展示*/
.big-app{ width: 762px; height: 500px; background:#fff url(../img/work_AppPhone.png) no-repeat;
    background-position: center center;
    border-radius: 15px;margin: 0px auto; border: 1px solid black; position: relative;
    top: 50%;
    left: 50%;
    margin-left: -381px;
    margin-top: -250px;
     z-index: 100000; display: none;}
.big-app ul li{ position: absolute;}
.big-app ul li img{ width: 100%; height: 100%;}
.big-app ul li div.hei{ width: 100%; height: 100%; background: #000000; position: absolute; }
.big-app ul li div.hei{opacity: 0;}
.big-app ul li.n1 div.hei{opacity: 0.5;}
.big-app ul li.n3 div.hei{opacity: 0.5;}

.big-app ul li.n0{ width: 135px; height: 168px; left: -124px; top: 200px; opacity: 0;}
.big-app ul li.n1{ width: 151px; height: 270px; left: 65px; top: 130px; opacity: 1;}
.big-app ul li.n2{ width: 190px; height: 335px; left: 288px; top: 84px; opacity: 1;}
.big-app ul li.n3{ width: 151px; height: 270px; left: 550px; top: 130px; opacity: 1;}
.big-app ul li.n4{ width: 135px; height: 168px; left: 753px; top: 200px; opacity: 0;}

.big-app .leftBtn-app{ width: 45px; height: 45px; background: url(../img/leftbut.png) no-repeat;
    z-index: 111; display: block; position:absolute; left: 4px; top: 223px; cursor:pointer;}
.big-app .rightBtn-app{ width: 45px; height: 45px; background: url(../img/rightbut.png) no-repeat;
    z-index: 111; display: block; position:absolute; right: 4px; top: 223px; cursor:pointer;}
.big-app .closed{ width: 60px; height: 40px; background: rgba(0,0,0,0.4); position:absolute;
    right: 0; top: 0; border-top-right-radius: 15px; border-bottom-left-radius: 15px; color: white;
    line-height: 40px; text-align: center; cursor:pointer; font-size: 16px;}

/*第二个页面big-vi展示*/
.big-vi{
    width: 560px;
    height: 300px;
    margin: 0px auto;
    border: 1px solid #000;
    position: relative;
    perspective:1000px;
    z-index: 100000;
    display: none;
    top: 50%;
    left: 50%;
    margin-left: -280px;
    margin-top: -150px;

}
.big-vi ul{
    list-style: none;
}
.big-vi ul li{
    position: absolute;
    transition:all 1s ease 0s;
    top: 0;
    left: 0;
}
.big-vi ul li img{
    /*让图片跟着自己的盒子变大、变小*/
    width: 100%;
}
.big-vi ul li.stateA{
    z-index: 777;
    opacity: 0;
    transform: rotateY(40deg) translateX(-200px) translateZ(-200px) scale(0.2);
}
.big-vi ul li.stateB{
    z-index: 888;
    transform: rotateY(40deg) translateX(-200px) translateZ(-200px) scale(0.7);
}
.big-vi ul li.stateC{
    width: 560px;
    z-index: 999;
    transform:none;
}
.big-vi ul li.stateD{
    z-index: 888;
    transform:rotateY(-40deg) translateX(-60px);
    transform: rotateY(-40deg) translateX(200px) translateZ(-200px) scale(0.7);
}
.big-vi ul li.stateE{
    width: 80px;
    z-index: 777;
    opacity: 0;
    transform: rotateY(-40deg) translateX(200px) translateZ(-200px) scale(0.2);
}
.big-vi ul li.waiting{
    display: none;
}
.big-vi .rightBtn{
    float: right;
    position: relative;
    z-index: 113213;
    left:0;
    top:135px;
    width: 50px;
    height: 30px;
    border-radius: 10px;
    border:none;
    background: rgba(245, 234, 17, 0.84);
    cursor: pointer;
}
.big-vi .leftBtn{
    float: left;
    position: relative;
    z-index: 113213;
    right:0;
    top: 135px;
    width: 50px;
    height: 30px;
    border-radius: 10px;
    border:none;
    background: rgba(245, 234, 17, 0.84);
    cursor: pointer;
}

.big-vi .closed{ width: 50px; height: 30px; background: rgba(0,0,0,0.5); position:absolute;
    top:-40px; right: 0px; color: white; border-radius: 15px; line-height:30px;
    text-align: center;  cursor: pointer;}

/*第二个页面big-web展示*/
.big-web{
    width: 1020px;
    margin: 0px auto;
    border: 1px solid black;
    height: 500px;
    position: relative;
    overflow: hidden;
    padding: 30px 0;
    box-sizing: border-box;
    z-index: 100000;
    display: none;
    top: 50%;
    left: 50%;
    margin-left: -510px;
    margin-top: -250px;
}
.big-web ul{
    list-style: none;
    position: absolute;
    width: 6000px;
    top: 0px;
    left: 0;
}
.big-web ul li{
    float: left;
    margin: 5px 10px 5px 0;
}
.big-web ul li img{
    height: 480px;
}
.big-web .closed{
    width: 50px;
    height: 30px;
    background: rgba(0,0,0,0.3);
    color: white;
    text-align: center;
    line-height:30px;
    position:absolute;
    right: 0;
    top: 0px;
    cursor: pointer;
}

/*第二个页面big-icon展示*/
.big-icon{ width: 998px; height: 370px; border: 1px solid #000000; margin: 0px auto;
    position: relative; padding: 40px 20px; border-radius: 15px; overflow: hidden; background: white;
    top: 50%;
    left: 50%;
    margin-left: -499px;
    margin-top: -185px;
z-index: 100000; display: none;}
.big-icon .con { width: 998px; height: 370px; border: 1px solid gold; overflow:hidden; }
.big-icon .con ul { width: 1100px; margin: 0 0 0 -1px; }
.big-icon .con ul li { float: left; width: 199px; border-left: 1px solid gold; }
.big-icon .closed{ width: 46px; height: 30px; background: rgba(0,0,0,0.5); position: absolute;
    right: 0; top: 0; color: white; text-align: center; line-height: 30px;
    border-bottom-left-radius: 15px; cursor: pointer;}

/*第二个页面big-mobile展示*/
.big-mobile{width: 800px; height: 520px; border: 1px solid black; margin: 0px auto;
    border-radius: 10px; position: relative; padding:20px; box-sizing: border-box;
    top: 50%;
    left: 50%;
    margin-left: -400px;
    margin-top: -260px;
z-index: 100000; background: #FFFFFF; display: none;}
.big-mobile>img{  position: absolute; top:300px; left: 0px;}
.big-mobile>div{ width: 200px; height: 200px; float: left; margin: 26px;}

.big-mobile p{ text-align: center;}

.big-mobile .one p{background: -webkit-linear-gradient(top,#f24141,#fff 50%,#fe6e6e);
    width: 172px;height: 30px;margin:20px 10px;border-radius: 100px;
    -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.6);-moz-box-shadow: 2px 2px 2px rgba(0,0,0,0.6);
    color: #2d2d2d;text-align: center;
    line-height: 30px; cursor: pointer;}
.big-mobile .two p{background: -webkit-linear-gradient(top,#f4a847,#fff 50%,#ffc479);width: 172px;
    height: 30px;margin:20px 10px;border-radius: 100px;-webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.6);
-ms-box-shadow: 2px 2px 2px rgba(0,0,0,0.6);color: #2d2d2d;text-align: center;
    line-height: 30px; cursor: pointer;}
.big-mobile .three p{background: -webkit-linear-gradient(top,#36e4bf,#fff 50%,#87f3dc);width: 172px;
    height: 30px;margin:20px 10px;border-radius: 100px;-webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.6);
    -ms-box-shadow: 2px 2px 2px rgba(0,0,0,0.6);color: #2d2d2d;text-align: center;
    line-height: 30px; cursor: pointer;}

.big-mobile .one img,.two img,.three img{ width: 200px; height: 200px; border-radius: 50%;
    border-radius: 50%;border: 1px dashed rgba(247, 28, 103, 0.62);
    box-shadow: 0px 8px 8px rgba(63, 59, 59, 0.46); cursor: pointer; transition:all 1s linear;}
.big-mobile .one img:hover,.two img:hover,.three img:hover{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);}

.big-mobile .closed{ width: 80px;height: 35px; line-height: 35px; position: absolute; right: -26px;
    top: -27px;background: rgba(0,0,0,0.4);text-align: center;font: 16px/30px "微软雅黑" "宋体";
    color: #fff;cursor: pointer; border-top-right-radius: 10px; border-bottom-left-radius: 10px;}


/*第三个页面主题展示的内容*/
.content .page3{ background:url("../img/page3.jpg") no-repeat top center; position: relative; }
.content .page3 .iphone{ position: absolute; left: 14%; top:24%; margin-left: -164px; margin-top: -150px;}
.content .page3.out .iphone{ left: -200px; top:700px;opacity: 0;}

.content .page3 .iphone>img{ position: absolute; left: 200px; top: 52px;}


.chuantong{
    height:364px;
    width:205px;
    position: relative;
    overflow: hidden;
    left: 295px;
    top:137px;

}
.chuantong ul{
    list-style: none;
    position: absolute;
    top:0;
    left:0;
    width:4000px;
}
.chuantong ul li{
    float: left;
    width:204px;
    height:364px;

}
/*.page3 .iphone .chuantong ul{
    list-style: none;
    position: absolute;
    top:0;
    left:0;
    width:4000px;
}

.page3 .iphone .chuantong ul li{ position: absolute; left:295px; top: 137px;}*/

/*第三个页面shelf的动画*/
.content .page3 .shelf{ width: 690px; height: 238px; background: url("../img/shelff.png") no-repeat;
position: absolute; top:50%; left: 68%; margin-top: -119px; margin-left: -345px;}
.content .page3.out .shelf{right:-100px; top:700px;opacity: 0;}

.content .page3 .shelf ul li{ width: 52px; height: 52px; background: url("../img/shelficon.png");
position: absolute;-webkit-animation:zhuan 2s linear infinite;}
@-webkit-keyframes zhuan{
    from{
        transform: rotate(0deg);
    }
    to{
        transform: rotate(360deg);
    }
}

.content .page3 .shelf .shelf-t0p{ width: 690px; height: 70px; position: absolute; left: 0; top: 0;
}
.page3 .shelf .shelf-t0p li:nth-of-type(1){background-position: -47px -14px; left: 45px; top: 13px;}
.page3 .shelf .shelf-t0p li:nth-of-type(2){background-position: -125px -14px; left: 124px; top: 11px;}
.page3 .shelf .shelf-t0p li:nth-of-type(3){background-position: -204px -14px; left: 203px; top: 11px;}
.page3 .shelf .shelf-t0p li:nth-of-type(4){background-position: -286px -14px; left: 283px; top: 11px;}
.page3 .shelf .shelf-t0p li:nth-of-type(5){background-position: -366px -14px; left: 361px; top: 11px;}
.page3 .shelf .shelf-t0p li:nth-of-type(6){background-position: -438px -14px; left: 437px; top: 11px;}
.page3 .shelf .shelf-t0p li:nth-of-type(7){background-position: -518px -14px; left: 515px; top: 11px;}
.page3 .shelf .shelf-t0p li:nth-of-type(8){background-position: -596px -14px; left: 596px; top: 11px;}


.content .page3 .shelf .shelf-center{ width: 690px; height: 70px; position: absolute; left: 0; top: 75px;
}
.page3 .shelf .shelf-center li:nth-of-type(1){background-position: -46px -95px; left: 45px; top: 18px;}
.page3 .shelf .shelf-center li:nth-of-type(2){background-position: -126px -95px; left: 124px; top: 18px;}
.page3 .shelf .shelf-center li:nth-of-type(3){background-position: -517px -95px; left: 515px; top: 18px;}
.page3 .shelf .shelf-center li:nth-of-type(4){background-position: -597px -95px; left: 596px; top: 18px;}

.content .page3 .shelf .shelf-down{ width: 690px; height: 70px; position: absolute; left: 0; top: 168px;
}
.page3 .shelf .shelf-down li:nth-of-type(1){background-position: -47px -174px; left: 45px; top: 6px;}
.page3 .shelf .shelf-down li:nth-of-type(2){background-position: -125px -174px; left: 124px; top: 6px;}
.page3 .shelf .shelf-down li:nth-of-type(3){background-position: -204px -174px; left: 203px; top: 6px;}
.page3 .shelf .shelf-down li:nth-of-type(4){background-position: -286px -174px; left: 283px; top: 6px;}
.page3 .shelf .shelf-down li:nth-of-type(5){background-position: -366px -174px; left: 361px; top: 6px;}
.page3 .shelf .shelf-down li:nth-of-type(6){background-position: -438px -174px; left: 437px; top: 6px;}
.page3 .shelf .shelf-down li:nth-of-type(7){background-position: -518px -174px; left: 515px; top: 6px;}
.page3 .shelf .shelf-down li:nth-of-type(8){background-position: -596px -174px; left: 596px; top: 6px;}
/*第四个页面关于的内容*/

.content .page4{ background:url("../img/page4.jpg") no-repeat top center; position: relative;}

/*第四个页面左边的文字的内容*/
.content .page4 .left-letter,.content .page4 .right-letter{ width: 400px; height: 300px; position: absolute;}
.content .page4 .left-letter{ left: 27%; top: 50%; margin-left: -200px; margin-top: -150px;}
.content .page4.out .left-letter{left:-200px; }

.content .page4 .left-letter p:nth-of-type(1){font-size: 24px; text-align: center; font-weight: bold;
color: white; text-shadow: 1px 2px 3px #2B17A1;}
.content .page4 .left-letter p:nth-of-type(2){ width: 400px; height: 23px; text-align: right;
    margin-bottom: 145px;margin-top: 16px; font-size: 14px;}
.content .page4 .left-letter p:nth-of-type(3){ width: 400px; height: 23px; text-align: right;font-size: 14px;
}
/*第四个页面右边的文字的内容*/
.content .page4 .right-letter{ right:13%; top: 50%; margin-top:-150px; margin-left: -200px;}
.content .page4.out .right-letter{right:-200px; }

.content .page4 .right-letter p:nth-of-type(1){font-size: 24px; text-align: center; font-weight: bold;
    color: white; text-shadow: 1px 2px 3px #2B17A1;}
.content .page4 .right-letter p:nth-of-type(2){ width: 400px; height: 23px; text-align:left;
    margin-bottom: 145px;margin-top: 16px; font-size: 14px;}
.content .page4 .right-letter p:nth-of-type(3){ width: 400px; height: 23px; text-align: left;font-size: 14px;
}

/*第四个页面中间图片的效果*/
.content .page4 .picture{ background: url("../img/aboutme.png") no-repeat; width: 382px; height: 347px;
position: absolute; left: 50%; top: 50%; margin-left: -191px; margin-top: -173px;}
.content .page4.out .picture{opacity: 0; -webkit-transform:rotate(720deg);}


/*第五个页面联系我的内容*/
.content .page5{ background:url("../img/page5.jpg") no-repeat top center; position: relative;}

/*联系我*/
.rolling{-webkit-transition:all 1s ease;}
.page5 .page5-in{ width: 980px; height: 600px; left: 50%; top: 50%; margin-left: -490px;
    margin-top:-300px; position: absolute; box-sizing: border-box;}
.page5 .page5-in ul{padding-top: 30px; width: 980px; height: 530px; }
.page5 .page5-in ul p.line{ width: 2px; height: 478px; background: #ee7075; position: absolute;
    left: 50%; margin-left: -1px; top:50%; margin-top: -239px;}
/*联系我-直线的动画*/
.page5.out .page5-in ul p.line{ -webkit-transform:rotate(1800deg); opacity: 0;}

/*联系我-姓名的动画*/
.page5 .page5-in ul li:nth-of-type(1) figure{ background: url("../img/me.png"); width: 64px; height:
64px; background-size: 100% 100%; position: absolute; left: 50%; margin-left: -32px; top: 60px;}
.page5.out .page5-in ul li:nth-of-type(1) figure{left:-300px; }

.page5 .page5-in ul li:nth-of-type(1) p{ font-weight: bold; font-size: 15px; position: absolute;
    right: 326px; top: 88px; color:#ed7075;}
.page5.out .page5-in ul li:nth-of-type(1) p{ right:-1000px;}

/*联系我-电话的动画*/
.page5 .page5-in ul li:nth-of-type(2) figure{ background: url("../img/mobile.png"); width: 64px; height:
64px; background-size: 100% 100%; position: absolute; left: 50%; margin-left: -32px; top: 164px;}
.page5.out .page5-in ul li:nth-of-type(2) figure{ margin-left: 500px; }

.page5 .page5-in ul li:nth-of-type(2) p{ font-weight: bold;color: #000; font-size: 15px; position: absolute;
    left: 290px; top: 188px;}
.page5.out .page5-in ul li:nth-of-type(2) p{ left:-1000px;}

/*联系我-QQ的动画*/
.page5 .page5-in ul li:nth-of-type(3) figure{ background: url("../img/qq.png"); width: 64px; height:
64px; background-size: 100% 100%; position: absolute; left: 50%; margin-left: -32px; top: 269px;}
.page5.out .page5-in ul li:nth-of-type(3) figure{ margin-left: -500px;}

.page5 .page5-in ul li:nth-of-type(3) p{ font-weight: bold;color: #000; font-size: 15px; position: absolute;
    right: 285px; top: 292px;}
.page5.out .page5-in ul li:nth-of-type(3) p{ right: 500px;}

/*联系我-邮箱的动画*/
.page5 .page5-in ul li:nth-of-type(4) figure{ background: url("../img/email.png"); width: 64px; height:
64px; background-size: 100% 100%; position: absolute; left: 50%; margin-left: -32px; top: 377px;}
.page5.out .page5-in ul li:nth-of-type(4) figure{ margin-left: 500px;}

.page5 .page5-in ul li:nth-of-type(4) p{ font-weight: bold;color: #e56b6e; font-size: 15px; position: absolute;
    left: 234px; top: 400px;}
.page5.out .page5-in ul li:nth-of-type(4) p{ left: -100px;}

/*联系我-微信的动画*/
.page5 .page5-in ul li:nth-of-type(5) figure{ background: url("../img/wechat.png"); width: 64px; height:
64px; background-size: 100% 100%; position: absolute; left: 50%; margin-left: -32px; top:482px;}
.page5.out .page5-in ul li:nth-of-type(5) figure{ margin-left: -500px;}

.page5 .page5-in ul li:nth-of-type(5) p{ font-weight: bold;color: #d6964b; font-size: 15px; position: absolute;
    right: 358px; top: 505px;}
.page5.out .page5-in ul li:nth-of-type(5) p{ right: -358px;}

/*弹窗背景*/
.window-bg{ width: 100%; height: 100%;position: fixed;  background: rgba(0,0,0,0.5); left: 0; top: 0;
z-index: 99999; display: none;}





